<script setup>
import { ref } from 'vue';
import { useRouter } from 'vue-router';
import { ElMessage } from 'element-plus';
import 'element-plus/dist/index.css';
import {userStore} from "@/store/index.js";
const router = useRouter();
</script>

<template>
  <div>
    <!-- 添加router属性 -->
    <el-menu router>
      <el-sub-menu index="1">
        <template #title>
          <el-icon><Connection /></el-icon>
          <span>我的订单</span>
        </template>
        <el-menu-item-group>
          <el-menu-item index="/myOrder/"><el-icon><Refresh /></el-icon>订单</el-menu-item>
          <el-menu-item index="/myOrder/appointment"><el-icon><Loading /></el-icon>预约订单</el-menu-item>
          <el-menu-item index="/myOrder/carOrder"><el-icon><Van /></el-icon>车辆订单</el-menu-item>
        </el-menu-item-group>
      </el-sub-menu>
    </el-menu>
  </div>
</template>

<!--<template>-->
<!--  <div class="app-container">-->
<!--    &lt;!&ndash; 侧边栏 &ndash;&gt;-->
<!--    <aside class="sidebar">-->
<!--      <el-menu router :default-active="$route.path" class="el-menu-vertical-demo">-->
<!--        <el-menu-item index="/address">-->
<!--          <i class="el-icon-location"></i>-->
<!--          <span slot="title">收货地址</span>-->
<!--        </el-menu-item>-->
<!--        <el-menu-item index="/myDetail">-->
<!--          <i class="el-icon-user"></i>-->
<!--          <span slot="title">个人信息</span>-->
<!--        </el-menu-item>-->
<!--      </el-menu>-->
<!--    </aside>-->
<!--    &lt;!&ndash; 主要内容区域 &ndash;&gt;-->
<!--    <main class="main-content">-->
<!--      <router-view></router-view>-->
<!--    </main>-->
<!--  </div>-->
<!--</template>-->

<style scoped>
.menu {
  height: 88vh;
}
h2 {
  background-color: #82b5f6;
  color: white;
  margin: 0;
  padding: 10px;
}
</style>